<%@ page pageEncoding='UTF-8'%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<s:set var="contextPath" value="#request.get('javax.servlet.forward.context_path')" scope="request" />
<!DOCTYPE html>
<head>
    <title>Doctor Registration</title>
    <%-- header --%>
    <jsp:include page="/WEB-INF/content/common/Header.jsp" flush="true"/>
    <script src="${contextPath}/js/jquery/jquery.validate.js"></script>
    <script src="${contextPath}/js/jquery/jquery.maskedinput.min.js"></script>
	<script src="${contextPath}/js/doctor/doctor.js"></script>
</head>
<body class="metro home">
	<%-- tob-bar --%>
    <jsp:include page="/WEB-INF/content/common/TopBar.jsp" flush="true"/>
       	
	<div id="main-container" class="body-wrapper">
        <%-- tob-container --%>
    	<jsp:include page="/WEB-INF/content/common/TopContainer.jsp" flush="true"/>
        
    	<div id="body-container">
        	<div id="doctor-registration-form-container" class="form-container">
        	
        		<%-- header-container --%>
        		<s:set var="mode" value="'registration'"/>
    			<jsp:include page="/WEB-INF/content/doctor/DoctorMenuContainer.jsp" flush="true"/>
    			
    			<%-- banner-container --%>
       
                <div class="form-body-container">
	        		<form id="doctor-registration-form" class="registration-form doctor-form" action="${contextPath}/doctor/insert" method="post">
	                	<input type="hidden" name="guiDoctor.userId" value="0" />
	                	<fieldset>
	                    	<legend style="width:95%">Doctor Registration</legend>
  							
                            <div class="action-error-container">
                                <s:if test="hasActionErrors()">  
                                    <s:actionerror/>
                                </s:if>
                        	</div>
                            
	                        <label>Name<em class="text-alert">*</em></label>
	                        <div class="input-control text" style="width:95%">
	                        	<input type="text" name="guiDoctor.name" value="" placeholder="insert name" required/>
	                            <button class="btn-clear"></button>
							</div>
	                        <label>Type</label>
	                        <div style="width:95%">
	                        	<input type="hidden" name="guiDoctor.type" value="DOCTOR" placeholder="input text"/>
	                            <div class="input-control text">
	    							<input type="text" value="" placeholder="Doctor" disabled/>
	    							<button class="btn-clear"></button>
								</div>
							</div>
	                        <label>Registration No<em class="text-alert">*</em></label>
	                        <div class="input-control text" style="width:95%">
	                        	<input type="text" name="guiDoctor.regNo" value="" placeholder="insert registration number" required/>
	                            <button class="btn-clear"></button>
							</div>
	                        <label>Designation<em class="text-alert">*</em></label>
	                        <div class="input-control text" style="width:95%">
	                        	<input type="text" name="guiDoctor.designation" value="" placeholder="insert designation" required/>
	                            <button class="btn-clear"></button>
							</div>
	                        <label>Qualification<em class="text-alert">*</em></label>
	                        <div class="input-control text" style="width:95%">
	                        	<input type="text" name="guiDoctor.qualifications" value="" placeholder="insert qualifications" required/>
	                            <button class="btn-clear"></button>
							</div>
	                        <label>Other</label>
	                        <div class="input-control text" style="width:95%">
	                        	<input type="text" name="guiDoctor.others" value="" placeholder="insert other info"/>
	                            <button class="btn-clear"></button>
							</div>
							<label>Telephone<em class="text-alert">*</em></label>
							<div>
								<div class="input-control text" style="width:95%">
		                        	<input type="text" name="guiDoctor.contact.telNo" value="${guiDoctor.contact.telNo}" placeholder="ex:(xxx) xxx-xxxx" class="required user-contact"/>
		                            <button class="btn-clear"></button>
								</div>
							</div>
							<label>Address<em class="text-alert">*</em></label>
	                    	<div>
								<div class="input-control text" style="width:95%">
		                        	<input type="text" name="guiDoctor.contact.address" value="${guiDoctor.contact.address}" placeholder="insert address" class="required"/>
		                            <button class="btn-clear"></button>
								</div>
							</div>
	                        <div>
	                        <label>Admin</label>
								<div>
									<div class="input-control radio default-style" data-role="input-control">
										<label>
											<input type="radio" name="guiDoctor.admin" value="true"/>
											<span class="check"></span> Yes
										</label>
									</div>
									<div class="input-control radio default-style" data-role="input-control">
										<label>									
											<input type="radio" name="guiDoctor.admin" value="false" checked="checked"/>
											<span class="check"></span> No
										</label>
									</div>
								</div> 
							</div>
	                       <div class="form-button-container">
								<a onClick="$('#doctor-registration-form').submit(); return false;">
                                    <div class="form-button tile half-vertical subheader-secondary bg-cobalt fg-white">
                                        Insert <i class="icon-pencil on-right smaller"></i>
                                    </div>
                            	</a> 
								<a href="${contextPath}">
		                          	<div class="form-button tile half-vertical subheader-secondary bg-cyan fg-white">
		                            	cancel <i class="icon-cancel-2 on-right smaller"></i>
		                           	</div>
								</a>
	                       </div>
	        			</fieldset>
	        		</form>
                </div>
    		</div>    
    	</div>
        
        <%-- bottom-container --%>
    	<jsp:include page="/WEB-INF/content/common/BottomContainer.jsp" flush="true"/>
        
	</div>
    
    <%-- footer-container --%>
    <jsp:include page="/WEB-INF/content/common/FooterContainer.jsp" flush="true"/>
    
</body>
</html>